import React, { Component } from 'react';
import Item from '../Item';

class List extends Component {
  render() {
    const {userArr, err, isFirst, isLoading} = this.props
    return (
      <div className='row'>
        {
          isFirst ? <h3>Enter name to search</h3> :
          isLoading ? <h3>Loading....</h3> :
          err ? <h3 style={{color:'red'}}>{ err }</h3> :
          userArr.map((user)=>{
            return <Item key={user.id} {...user}/>
          })
        }
      </div>
    );
  }
}

export default List;